<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport"
	content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="">
<meta http-equiv="description" content="">
<link rel="stylesheet" type="text/css" href="bower_components/bootstrap/dist/css/bootstrap.min.css"/>
<link rel="stylesheet" type="text/css" href="bower_components/bootstrap/dist/css/bootstrap-theme.min.css"/>
<link rel="stylesheet" type="text/css" href="bower_components/animate.css/animate.min.css"/>
<style type="text/css">
html{
	font-size:16px;
}
.carousel-inner>.item img{
	width:100%;
	max-height:240px;
}
.thumbnail{
	border:none !important;
	box-shadow:none;
	-webkit-box-shadow:none;
}
nav .thumbnail>img{
	width:2rem;
	height:2rem;
}
.product_img{
	width:100%;
	max-width:150px !important;
}
</style>
</head>
<body>
  <header>
 
    <div id="carousel-header" class="carousel slide" data-ride="carousel">
 
  <!-- Indicators -->
  <ol class="carousel-indicators">
    <li data-target="#carousel-header" data-slide-to="0" class="active"></li>
    <li data-target="#carousel-header" data-slide-to="1"></li>
    <li data-target="#carousel-header" data-slide-to="2"></li>
  </ol>

  <!-- Wrapper for slides -->
  <div class="carousel-inner" role="listbox">
    <div class="item active">
      <img src="images/c1.jpg" alt="...">
      <div class="carousel-caption">
      </div>
    </div>
    <div class="item">
      <img src="images/c2.jpg" alt="...">
      <div class="carousel-caption">
      </div>
    </div>
    <div class="item">
      <img src="images/c3.jpg" alt="...">
      <div class="carousel-caption">
      </div>
    </div>
  </div>

  <!-- Controls -->
  <a class="left carousel-control" href="#carousel-header" role="button" data-slide="prev">
    <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
    <span class="sr-only">Previous</span>
  </a>
  <a class="right carousel-control" href="#carousel-header" role="button" data-slide="next">
    <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
    <span class="sr-only">Next</span>
  </a>
</div>
</header>
<nav  style="border-bottom:1px solid #ddd;">
<div class="container">
			<div class="row">
                <div class="col-xs-4">
                <div class="thumbnail">
          			<img data-src="" alt="" src="images/user.jpg" data-holder-rendered="true">
          			<div class="caption">
            			<h5 class="text-center">用户中心</h5>
          			</div>
        		</div>
				</div>
				
                <div class="col-xs-4">
                <div class="thumbnail">
          			<img data-src="" alt="" src="images/tuiguang.jpg" data-holder-rendered="true">
          			<div class="caption">
            			<h5 class="text-center">推广</h5>
          			</div>
        		</div>
				</div>
                <div class="col-xs-4">
                <a class="thumbnail" href="#">
          			<img data-src="" alt="" src="images/shopCart.jpg" data-holder-rendered="true">
          			<div class="caption">
            			<h5 class="text-center">购物车<span class="badge">0</span></h5>
          			</div>
        		</a>
				</div>
			</div>
</div>
</nav>
	<div id="container">
			<div class="row">
				 <div class="col-xs-3">
                <div class="thumbnail">
          			<img data-src="" alt="" src="images/example1.jpg" data-holder-rendered="true" class="product_img">
          			<div class="caption">
            			<h5 class="text-center">金龙鱼 阳光葵花子油</h5>
          			</div>
        		</div>
				</div>
                 <div class="col-xs-3">
                <div class="thumbnail">
          			<img data-src="" alt="" src="images/example2.jpg" data-holder-rendered="true" class="product_img">
          			<div class="caption">
            			<h5 class="text-center">油臣 肉松饼经典原味208G/袋</h5>
          			</div>
        		</div>
				</div>
                 <div class="col-xs-3">
                <div class="thumbnail">
          			<img data-src="" alt="" src="images/example3.jpg" data-holder-rendered="true" class="product_img">
          			<div class="caption">
            			<h5 class="text-center">奥佳莱虾片 烟熏三文鱼味</h5>
          			</div>
        		</div>
				</div>
                <div class="col-xs-3">
                <div class="thumbnail">
          			<img data-src="" alt="" src="images/example4.jpg" data-holder-rendered="true" class="product_img">
          			<div class="caption">
            			<h5 class="text-center">Swiss Miss瑞士小姐浓情巧克力冲饮粉</h5>
                        <p class="text-danger"><span class="glyphicon glyphicon-yen"></span>23.88<a href="#" class="btn btn-info pull-right" role="button"><span class="glyphicon glyphicon-shopping-cart"></span>购买</a></p>
          			</div>
        		</div>
				</div>
			</div>
	</div>

	<div class="modal fade" id="myModal" tabindex="-1" role="dialog"
		aria-labelledby="myModalLabel">
		<div class="modal-dialog modal-lg" role="document">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal"
						aria-label="Close">
						<span aria-hidden="true">&times;</span>
					</button>
					<h4 class="modal-title" id="myModalLabel"></h4>
				</div>
				<div class="modal-body"></div>
				<div class="modal-footer"></div>
			</div>
		</div>
	</div>
<script type="text/javascript" src="js/respond.min.js"></script>
<script type="text/javascript" src="js/respond.matchmedia.addListener.min.js"></script>
<script type="text/javascript" src="bower_components/jquery/dist/jquery.min.js"></script>
<script type="text/javascript" src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
	<script type="text/javascript">
		$(function() {
		});
	</script>
</body>
</html>
